#container {
	padding: 20px 20px 0px 20px;

	.servers {
		display: flex;

		.mat-card-content {
			display: flex;
			width: 100%;

			.nonConnected {
				flex: 1;
				display: flex;
				flex-direction: column;
				height: 100%;
				justify-content: center;
				padding: 0px 40px;

				> div {
					gap: 20px;
					display: flex;

					.mat-form-field, button {
						width: 250px;
					}
				}
			}

			.infos {
				min-width: 160px;
				max-width: 226px;
				display: flex;
				flex-direction: column;
				justify-content: space-around;

				h4 {
					margin: 14px 0px 0px 6px;

					span {
						vertical-align: bottom;
					}
				}
			}

			.mat-list-base {
				min-width: 280px;
				overflow: auto;
				height: 100%;
				display: flex;
				flex-direction: column;
				flex-wrap: wrap;
				flex: 1;

				a {
					flex: 1;
					text-decoration: none;
					color: inherit;
					font-size: 15px;
					display: flex;
					gap: 10px;

					.tableCount {
						width: 28px;
						text-align: right;
					}
				}
			}

			.mat-list-option {
				max-width: 375px;
				margin: 0px auto;
			}

			.right-actions {
				display: flex;
				flex-direction: column;
				width: 160px;
				align-items: stretch;
				justify-content: space-between;
			}
		}

		.logo {
			display: flex;
			justify-content: center;

			img {
				max-width: 88px;
				height: 44px;
				padding: 2px 4px;
			}
		}
	}

	::ng-deep .mat-tab-body:first-child {
		.mat-card {
			height: 240px !important;
		}
	}

	::ng-deep .mat-card-header-text {
		margin: 0px;
		width: 100%;
	}

	::ng-deep .mat-tab-body-wrapper {
		overflow: auto;
		height: calc(100vh - 126px);
	}

	::ng-deep .mat-tab-labels {
		.mat-tab-label-content {
			gap: 4px;
		}

		& > div:last-child {
			right: 0px;
			position: absolute;
		}
	}

	::ng-deep .mat-tab-body-content {
		height: inherit;
		overflow: inherit;
	}
}

@media (max-width: 1200px) {
	#container {
		padding: 0px;

		::ng-deep .mat-tab-body-wrapper {
			height: calc(100vh - 106px) !important;
		}
	}

	.servers .login {
		padding: 0px 0px !important;

		> div {
			flex-direction: column;
		}
	}

	.nonConnected {
		.mat-form-field, button {
			width: 170px !important;
		}
	}
}
